<template>
  <a-select :style="{ width: '200px' }" placeholder="按工具名或者代码搜索" allow-search @change="fuzzySearchbyName()" v-model="selectValue">
    <a-option v-for="(item,index) in subMenuTitleList" :value="item.path">{{ item.title }}</a-option>
  </a-select>
</template>

<script>
import { menuRouter } from "@/router/menuRouter";

export default {
  name: "Searcher",
  data() {
    return {
      // inputText: null,
      subMenuTitleList: [],
      selectValue:''
    };
  },
  mounted() {
    // 遍历获取到所有的子菜单名字和路径
    menuRouter.forEach(parent => {
      if (parent.children.length != 0) {
        parent.children.forEach(children => {
          this.subMenuTitleList.push({
            'title': children.meta.title,
            'path': children.path
          })
        });
      }
    });
  },
  methods: {
    fuzzySearchbyName() {
      this.$router.push(this.selectValue);
    }
  }
};
</script>

<style scoped>
/* 覆盖样式 */
.arco-input-wrapper {
  width: auto;
}
</style>